<template>
<div>
<div style="padding: 44px 0 50px 0" v-if="isLogin2">
  <search></search>
  <swiper :autoplay='true' :circular='true' :interval='3000' :indicator-dots='true' style="height:61.3vw">
    <swiper-item v-for="(item,index) in data.banner" :key="index">
      <a href="" v-if="item.type==6" class="swiper_item" @click="towebView(item.link)">
        <img :src="item.image" alt="" mode="widthFix">
      </a>
      <a v-else class="swiper_item">
        <img :src="item.image" alt="" mode="widthFix">
      </a>
    </swiper-item>
  </swiper>
  <div :style="'background:'+data.color+';padding: 20px 0;width:100vw'">
    <today-users :list="data.today"></today-users>
    <div class="main-features-wrap" >
        <features-wrap :data="data"></features-wrap>
    </div>
  </div>
  <div :href="data.group.info.link" style="margin-bottom: 20px;display:block"  v-if="data.group.info.type==6" @click="towebView(data.group.info.link)">
    <img :src="data.group.info.image" alt="" style="width:100%;display:block" mode="widthFix">
  </div>
  <a style="margin-bottom: 20px;display:block"  v-else>
    <img :src="data.group.info.image" alt="" style="width:100%;height:54vw;display:block">
  </a>
  <div class="xianshixianliang">
    <a v-if="data.limit_time.is_open == 1&&data.limit_time.info.type==6" @click="towebView(data.limit_time.info.link)">
      <img :src="data.limit_time.info.image" alt="" mode="widthFix">
    </a>
    <a v-if="data.limit_time.is_open == 1&&data.limit_time.info.type!=6">
      <img :src="data.limit_time.info.image" alt="" mode="widthFix">
    </a>
    <a v-if="data.limit_number.is_open == 1&&data.limit_number.info.type==6" @click="towebView(data.limit_number.info.link)">
      <img :src="data.limit_number.info.image" alt="" mode="widthFix">
    </a>
    <a v-if="data.limit_number.is_open == 1&&data.limit_number.info.type!=6">
      <img :src="data.limit_number.info.image" alt="" mode="widthFix">
    </a>
  </div>
  <div style="background:#f5f5f5">
    <div v-for="(item,index) in data.activity" :key="index" style="padding: 0 4vw">
      <div class="active1" v-if="item.type==1">
        <a @click="towebView(item.url)">
          <img :src="item.image" alt="" mode="widthFix" style="width:100%">
        </a>
        <ul>
          <li v-for="(item1,index1) in item.list" :key="index1">
            <a :href="'/pages/detail/main?type=1&join_id=0&limit_id=0&group_id=0&goods_id='+item1.goods_id">
              <div style="height: 29.44vw;overflow:hidden;line-height:33vw">
                <img :src="item1.image" alt="" style="line-height:33vw;display:inline-block;height: 100%;width:33vw" mode="widthFix">
              </div>
              <div style="font-size:13px" class="goodsMsg">
                <p style="color:#333333">{{item1.goods_name}}</p>
                <p style="color:#FF4C50">￥{{item1.sell_price}}</p>
              </div>
            </a>
          </li>
        </ul>

      </div>
      <div class="active2" v-if="item.type==2">
          <a :href="'/pages/specialArea/main?&type=1&page=1&category_id='+item.relate_id">
              <img :src="item.image" alt="" mode="widthFix" style="width:100%">
          </a>
          <ul>
              <li v-for="(item1,index1) in item.list" :key="index1">
                  <a :href="'/pages/detail/main?type=1&join_id=0&limit_id=0&group_id=0&goods_id='+item1.goods_id">
                      <div style="height: 29.44vw;overflow:hidden;line-height:33vw">
                          <img :src="item1.image" alt="" style="line-height:33vw;display:inline-block;height: 100%;width:33vw" mode="widthFix">
                      </div>
                      <div style="font-size:13px" class="goodsMsg">
                          <p style="color:#333333">{{item1.goods_name}}</p>
                          <p style="color:#FF4C50">￥{{item1.sell_price}}</p>
                      </div>
                  </a>

              </li>
          </ul>
      </div>
    </div>
  </div>
  <goods-list ref="mychild" :categoryId="category_id" :category="data.category"></goods-list>
</div>
</div>
</template>
<script>
import card from '@/components/card'
import request from '@/actions/request.js'
import localStroage from '@/actions/localStorage.js'
import Search from '@/components/home/search'
import featuresWrap from '@/components/home/featuresWrap'
import todayUsers from '@/components/home/todayUsers'
import goodsList from '@/components/home/goodsList'
export default {
  data () {
    return {
      data:{},
      userInfo: {},
      data1:{},
      active:1,
      category_id:'',
      isLogin:false,
      isLogin2:false,
    }
  },
  onShow(){
    wx.setStorageSync("allGoodsAct",);
  },
  components: {
    card,
    Search,
    featuresWrap,
    todayUsers,
    goodsList,
  },
  watch: {

  },
  methods: {
    towebView(linkUrl){

      let url='../../pages/webView/main'
      localStroage.setStorage('linkUrl',linkUrl)
      wx.navigateTo({ url })
    },
    getshopIndex() {
      request.index('api/shop/newindex','post',{},{},false,this);
    },
    clickParent() {
      this.$refs.mychild.pageAdd();
    }
  },
  //下拉刷新
  // async onPullDownRefresh() {
  //   // request.getshopIndex();
  //   this.getshopIndex();
  //   this.page=1;
  //   this.category_id=this.data.category[0].category_id;
  //   this.clickParent();
  // },
  //上拉加载
  onReachBottom() {
    this.clickParent()
  },
  created () {
    // 调用应用实例的方法获取全局数据
    // this.getUserInfo();
  },
  mounted () {
    this.getshopIndex();
  }
}
</script>

<style scoped lang="scss">
  .swiper_item{
      height: 100%;
      width: 100%;
      display: block;
    img{
      height: 100%;
      width: 100%;
    }
  }
  .main-features-wrap {
      width: 100vw;
      // margin-top: .75rem;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 20px;

  }
  .xianshixianliang{
    display: flex;
    justify-content: space-between;
    width: 92vw;
    margin: 0 auto;
    margin-top: 20px;
    a{
        width: 48%;
        display: inline-block;
        border-radius: 8px;
        overflow: hidden;
        img{
            width: 100%
        }
    }
  }
  .active1{
    overflow: hidden;
    margin-top: 20px;
    ul{
        display: flex;
        justify-content: space-between;
        background:#f5f5f5;
        padding: 0 4vw;
    }
    li{
        width: 32%;
        background:#ffffff;
        border-radius: 5px;
        overflow: hidden;
        .goodsMsg{
            p{
                margin-left:13px;
                overflow: hidden;
                text-overflow : ellipsis;
                white-space: nowrap;

            }
        }
    }
  }
.active2{
    margin-top: 20px;
    background: #f5f5f5;
    ul{
        display: flex;
        justify-content: space-between;
        background:#f5f5f5;
        padding: 0 4vw;
        margin-top: -60px;
    }
    li{
        width: 32%;
        background:#ffffff;
        border-radius: 5px;
        overflow: hidden;
        .goodsMsg{
            p{
                margin-left:13px;
                overflow: hidden;
                text-overflow : ellipsis;
                white-space: nowrap;

            }
        }
    }
  }
</style>
